<!DOCTYPE html>
<html lang="zh-Hans">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>手机画板</title>
    <link rel="stylesheet" href="./main.css" />
  </head>
  <body>
    <canvas id="canvas"></canvas>
    <div class="actions" id="actions">
      <svg class="icon active" id="pen">
        <use xlink:href="#icon-pen"></use>
      </svg>
      <svg class="icon" id="eraser">
        <use xlink:href="#icon-eraser"></use>
      </svg>
      <svg class="icon" id="clear">
        <use xlink:href="#icon-qingping"></use>
      </svg>
      <svg class="icon" id="save">
        <use xlink:href="#icon-baocundaoshouji-"></use>
      </svg>
    </div>
    <ol class="colors">
      <li class="black" id="black"></li>
      <li class="red" id="red"></li>
      <li class="blue" id="blue"></li>
      <li class="green" id="green"></li>
    </ol>
    <ol class="sizes">
      <li id="thin" class="thin"></li>
      <li id="strong" class="strong"></li>
    </ol>

    <script src="./main.js"></script>
    <script src="//at.alicdn.com/t/font_1664178_jpvmbg3u0pb.js"></script>
  </body>
</html>
